<template>
  <div class="layui-row">
      <!-- 头部导航块 -->
      <top-lump>
          <form class="layui-form layui-form-pane" action="">
                <div class="layui-form-item">
                  <div class="layui-inline">
                    <label class="layui-form-label">模块名称</label>
                    <div class="layui-input-inline">
                      <input type="text" name="name" placeholder="规格名称"  autocomplete="off" class="layui-input">
                    </div>
                  </div>
                  <div class="layui-inline">
                    <label class="layui-form-label">关键字</label>
                    <div class="layui-input-inline">
                      <input type="text" name="keyword" placeholder="关键字" autocomplete="off" class="layui-input">
                    </div>
                  </div>

                  <div class="layui-inline">
                      <div class="layui-btn-group">
                        <button type="reset" class="layui-btn">清除</button>
                        <button class="layui-btn" lay-submit="" lay-filter="module-query">查询</button>
                      </div>
                  </div>
                </div>
          </form>
      </top-lump>
      <info-lump>
        <base-card title="编程规范查询" minHeight="700px">
             <table class="layui-table" lay-skin="nob" lay-size="lg">
                <colgroup>
                    <col>
                    <col>
                    <col>
                    <col>
                    <col>
                </colgroup>
                 <thead>
                    <tr>
                        <th>规范名称</th>
                        <th>版本号</th>
                        <th>关键字</th>
                        <th>备注</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="moduleitem in moduleList" :code="moduleitem.id">
                        <td>{{moduleitem.name}}</td>
                        <td>{{moduleitem.version}}</td>
                        <td>{{moduleitem.keyword}}</td>
                        <td>{{moduleitem.remark}}</td>
                        <td style="text-align: center;">
                          <div class="layui-btn-group">
                            <button class="layui-btn layui-btn-sm" v-on:click="displayStandard(moduleitem.id)">
                              <i class="layui-icon">&#xe60b;</i>
                            </button>
                            <button class="layui-btn layui-btn-sm" v-on:click="editModule(moduleitem.id)">
                              <i class="layui-icon">&#xe642;</i>
                            </button>
                            <button class="layui-btn layui-btn-sm" v-on:click="deleteThisStandard(moduleitem.id)">
                              <i class="layui-icon">&#xe640;</i>
                            </button>
                          </div>
                        </td>
                    </tr>
                </tbody>
            </table>

        </base-card>
      </info-lump>


  </div>
</template>

<script>

export default {
    data () {
        return {
            moduleList:[],
        }
    },
    created(){
       this.initModuleInfo();
    },
    mounted(){
      var that = this;
      //监听提交
      layui.form.on('submit(module-query)', function(data){
        that.initModuleInfo(data.field);
        return false;
      });
      layui.form.render();
    },
    methods:{
      /**
       * 初始化标准信息
       */
        initModuleInfo:function(standardQuery){
            var url = this.$store.state.RootURL + "/modules";
            var that = this;
            var project_id = this.$store.state.projectId;
            if(standardQuery==null){
              standardQuery={};
            }
            standardQuery.projectId = project_id;
            $.ajax({
                url: url,
                type:"get",
                async: false,
                dataType:'json',
                data:standardQuery,
                success: function(data){
                  console.log("模块  ： "+JSON.stringify(data));
                  that.moduleList = data.data;
                }
            });
        },
        /**
         * 跳转到规范信息展示
         */
        displayStandard:function(standardId){
          console.log(standardId);
           this.$router.push({
                path:"/showStandard",
                name:'展示规范',
                params:{
                    title:'nameValue',
                    id:standardId
                }

            });
        },
        /**
         * 删除模块
         */
        deleteThisModule:function(standardId){
            layer.msg("为保证项目资料完整，该功能待权限模块开发完成后开放");
            return ;
            var deleteurl = this.$store.state.RootURL+"/detele/standard";
            var that = this;
            layer.alert('确认删除该模块！', {
              skin: 'layui-layer-molv' //样式类名
              ,closeBtn: 0}, function(){
                $.ajax({
                  url: deleteurl,
                  type:"GET",
                  async: true,
                  dataType:'json',
                  data: {"id":standardId},
                  success: function(data){
                    layer.msg(data.msg);
                    that.initStandardInfo();
                  }
              });

            });


        },
        editModule:function(moduleId){
          console.log(moduleId);
           this.$router.push({
                path:"/editModule",
                name:'编辑模块',
                params:{
                    id:moduleId
                }

            });
        }
    }
}
</script>

<style lang="scss">
.kgo-input-text{
    height: 35px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #e6e6e6;
}
</style>
